<template>
	<view>
		<view class="warp-sign">
			<view class="sign-view">
				<view class="sign-view-head">
					已连续签到<text>{{continuous_sign_days}}</text>天
				</view>
				<text v-if="LinkType">
					签到领K币，新剧抢先看，连续签到7天领惊喜礼包。
				</text>
				<view class="sign-info-list">
					<view v-for="(item,index) in signList" :key="index"
						:class="item.isSign ? 'sign-info stop-sign':'sign-info'" @click="sign(index)">
						<image src="../../static/integral.png" mode=""></image>
						<view>{{item.integral}}</view>
					</view>
				</view>
			</view>
		</view>
		<!-- 签到成功弹窗 -->
		<view v-if="signPopup" class="signMask" @click="closeMask()"></view>
		<view v-if="signPopup" class="signPopup">
			<view class="signPopup-title">
				签到成功
			</view>
			<view class="signPopup-tips">
				<view>每天签到</view>
				<view>可继续领K币福利</view>
			</view>
			<view class="signPopup-Kb">
				<image src="../../static/integral.png" mode=""></image>
				<view>+{{species}}</view>
			</view>
			<view class="signPopup-buttom" @click="reminder">签到提醒</view>
			<view class="signPopup-close">
				<image @click="closeMask()" src="../../static/close.png"></image>
			</view>
		</view>
		<view class="warp">
			<view>
				<view class="history" v-if="cateList.length>0">
					<text class="title">我的追剧</text>
					<view>
						<view class="historyWarp" v-if="cateList.length>0">
							<view class="scroll-view_H">
								<view class="imageBox" v-for="(el,index) in cateList" :key="index"
									@click="goToDetails(el)" v-if="cateList.length>0">
									<image :src="el.cover_img" mode="" lazy-load :lazy-load-margin="0"></image>
									<view class="text">{{el.name}}</view>
									<view class="count">共{{el.count}}集</view>
								</view>
							</view>
							<!-- 	<view class="moreBox" @click="goMore">
								<view class="imgBox">
									<image src="../../static/ziyuan.png" mode=""></image>
									<text>更多记录</text>
								</view>
							</view> -->
						</view>
						<view class="check" v-else>
							空空如也！
						</view>
					</view>
				</view>
				<view class="like">
					<text class="title">猜你喜欢</text>
					<!-- <text class="helpIcon" @click="goHelp">?</text> -->
					<scroll-view v-if="recommendList.length>0" class="cate-right" :scroll-y="true"
						@scrolltolower="loadMoreCateData">
						<view class="cate-rdata" v-for="(item, index) in recommendList" :key="index"
							@click="goToDetails(item)">
							<navigator url="11">
								<image class="image" lazy-load :lazy-load-margin="0" :src="item.cover_img" />
							</navigator>
							<view class="cate-rinfo">
								<view class="cate-rfooter">
									<view class="cate-rtitle">
										{{item.name}}
									</view>
									<!-- <text class="cate-rbtn" @click.stop="edit(item)">···</text> -->
								</view>
								<view class="cate-rdesc" v-if="LinkType == true">
									<!-- 看到第{{item.sort}}集 -->
								</view>
								<view class="cate-rfooter" v-if="LinkType == true">
									<view class="cate-rnum">更新至{{item.number_of_sets}}集</view>
								</view>
							</view>
						</view>
					</scroll-view>
					<view class="loading-tips" v-else>
						<view class="tip-text">暂无追剧</view>
						<!-- <van-button type="danger" @click="gorunVideo">去追剧</van-button> -->
					</view>
				</view>
			</view>
			<!-- <navigator url="/wxcomponents/officialAccount/officialAccount" hover-class="none">
			<van-notice-bar mode="closeable" :scrollable="false" class="noticeBox">
				点击前往关注公众号，了解剧集更新状态</van-notice-bar>
		</navigator> -->
			<!-- 		<van-popup :show="flag" @close="onClose" round :lock-scroll="true" :safe-area-inset-bottom="true"
				position="bottom" custom-style="height: auto;padding:10px 10px;z-index:1000000;background-color: #fff;">
				<view class="popup popupBorder" @click="stopVideo">
					停止追剧
				</view>
				<view class="popup" @click="onClose">
					取消
				</view>
			</van-popup> -->
			<view v-if="flagPopup" class="signMask" @click="closeMask()"></view>
			<view v-if="flagPopup" class="popup">
				<view class="popup-close">
					<image src="../../static/close.png" mode="" @click="closeMask()"></image>
				</view>
				<view class="popup-home">
					<image :src="picture" mode=""></image>
					<view v-if="applet_name">{{applet_name}}官方</view>
				</view>
				<view class="popup-tips">{{language}}</view>
				<view class="popup-button" @click="gogzh">立即关注</view>
			</view>
		</view>
	</view>
</template>

<script>
	import {
		getrecordlist,
		getcancelPlay,
		getBingeWatchList,
		login,
		getSignList,
		getSignDay,
		getRecommendList,
		getWxAppID,
		signTip
	} from '../../module/index.js'
	// import dayjsMin from '../../until/dayjs.min.js';
	const app = getApp()
	export default {
		data() {
			return {
				toView: "",
				selectEpis: 1,
				selecttabs2: 0,
				selectTabs: "current",
				isEpisode: false,
				popupBase: {
					title: "要追剧吗",
					content: "喜欢本剧就加入追剧列表吧！",
					confirmText: "追剧"
				},
				base: false,
				costShow: false,
				flagPopup: false,
				signList: [{

					integral: "100",
					isSign: false
				}, {

					integral: "100",
					isSign: false
				}, {

					integral: "100",
					isSign: false
				}, {

					integral: "100",
					isSign: false
				}, {

					integral: "150",
					isSign: false
				}, {

					integral: "150",
					isSign: false
				}, {

					integral: "180",
					isSign: false
				}],
				LinkType: uni.getStorageSync('is_online'),
				flag: false,
				show: false,
				scrollTop: 0,
				old: {
					scrollTop: 0
				},
				history: [
					// 	{
					// 	cover_img: "http://short-theatre.oss-cn-shenzhen.aliyuncs.com/2022-12-16/20-45-5-%E5%BE%AE%E4%BF%A1%E5%9B%BE%E7%89%87_20221216204136.jpg",
					// 	name: "无上尊者归来",
					// },
				],
				cateIndex: 0,
				cateId: "",
				cateDataLoading: true, // 右侧数据是否加载中
				cateDataLoadOver: false, // 右侧数据是否加载完
				cateDataPage: 1, // 右侧数据页码
				TipTitle: "精选",
				cateList: [],
				recommendList: [],
				video_id: "",
				params: {
					page: 1,
					limit: 10,
					total_page: 0
				},
				signPopup: false,
				selectIndex: -1,
				today_is_sign: 0,
				continuous_sign_days: 0,
				species: 0,
				applet_template_id: "X3sKZeEo9lYtSPLaYKYIMuobK3NdoxKHHIqB14uW_yM",
				picture: "/static/dianshi.png",
				language: "关注公众号,获取精彩福利",
				applet_name: "小程序"
			}
		},
		onShow() {
			this.params.page = 1;
			this.cateList = []
			if (uni.getStorageSync('token') !== '' ? true : false) {
				// this.getrecordlist()
				this.getBingeWatchList()
				this.getSignList()
				this.getlist()
			}
		},

		// 页面初始函数
		onLoad: function(e) {
			// uni.startPullDownRefresh();
			// this.getisOnline()
			uni.setStorageSync('login_message', {
				official_account_id: e?.official_account_id,
				uid: e?.uid,
				video_id: e?.video_id
			})
			this.getWxAppIDinfo()
		},

		onUnload() {
			this.timer && clearTimeout(this.timer);
		},
		onReachBottom() {
			let {
				total_page,
				page
			} = this.params
			if (page > total_page > 0) {
				return;
			}
			this.getBingeWatchList()
		},
		methods: {
			getWxAppIDinfo() {
				let data = {
					app_id: tt.getEnvInfoSync().microapp.appId
				}
				getWxAppID(data).then((res) => {
					if (res.code == 200) {
						if (res.data.follow_link) this.flagPopup = true
						this.applet_template_id = res.data.template_id ||
							'X3sKZeEo9lYtSPLaYKYIMuobK3NdoxKHHIqB14uW_yM'
						this.picture = res.data.picture || '/static/dianshi.png'
						this.language = res.data.language || '关注公众号,获取精彩福利'
						this.applet_name = res.data.name || '小程序'
						uni.setStorageSync('follow_link',res.data.follow_link)
					}
				}).catch(err => {
					console.log(err)
				})
			},
			reminder() {
				if (uni.getStorageSync('environment') === 'applet') {
					let that = this
					wx.requestSubscribeMessage({
						tmplIds: [`${this.applet_template_id}`],
						success() {
							uni.showToast({
								title: "订阅成功!",
								icon: "none"
							})
							that.postSignTip()
						},
						complete(res) {
							that.signPopup = false
						}
					})
					return
				}
				this.signPopup = false
			},
			postSignTip() {
				let data = {
					app_id: tt.getEnvInfoSync().microapp.appId,
					template_id: this.applet_template_id
				}
				signTip(data).then((res) => {
					console.log(res);
				})
			},
			getlist() {
				getRecommendList().then((res) => {
					if (res.code === 200) {
						this.recommendList = res.data
					} else {
						uni.showToast({
							title: res.message,
							icon: "none"
						})
					}
				}).catch(err => {
					console.log(err)
				})
			},
			selectEpisode(item) {
				if (item > 10) return
				this.selectEpis = item
			},
			selectTabsTile(index, item) {
				this.selecttabs2 = index
				this.toView = 'MD' + (item.split('-')[0])
			},
			tabsClick(tabs) {
				this.selectTabs = tabs
			},
			episode() {
				this.isEpisode = true
			},
			select(index) {
				console.log(112)
				this.selectIndex = index
			},
			closeMask() {
				this.base = false
				this.signPopup = false
				this.costShow = false
				this.isEpisode = false
				this.flagPopup = false
				setTimeout(function() {
					uni.showTabBar()
				}, 500);
			},
			goCost() {
				this.costShow = true
				uni.hideTabBar()
			},


			gogzh() {
				this.flagPopup = false
				uni.navigateTo({
					url: `/wxcomponents/officialAccount/officialAccount`,
					
				});
			},
			sign(index) {
				if (this.today_is_sign === 1) {
					uni.showToast({
						title: "今日已签到,明天再来吧!",
						icon: "none"
					})
				} else {
					// 签到
					this.getSignDay()
				}
				// console.log(dayjsMin().format('YYYY-MM-DD'))
			},
			// 点击签到
			getSignDay() {
				getSignDay().then((res) => {
					if (res.code === 200) {
						this.getSignList()
						this.signPopup = true
					} else {
						uni.showToast({
							title: res.message,
							icon: "none"
						})
					}
				}).catch(err => {
					console.log(err)
				})
			},
			// 获取签到数据
			getSignList() {
				getSignList().then((res) => {
					if (res.code === 200) {
						this.continuous_sign_days = res.data.continuous_sign_days
						this.today_is_sign = res.data.today_is_sign
						for (let i = 0; i < this.continuous_sign_days; i++) {
							this.signList[i].isSign = true
						}
						this.species = this.signList[this.continuous_sign_days - 1]?.integral || 0
					} else {
						uni.showToast({
							title: res.message,
							icon: "none"
						})
					}
				}).catch(err => {
					console.log(err)
				})
			},
			getrecordlist() {
				//发起请求
				getrecordlist().then((res) => {
					if (res.code === 200) {
						uni.stopPullDownRefresh();
						if (res.data.data !== null) {
							// this.history = res.data?.data?.slice(0, 3)
						}
					} else {
						uni.stopPullDownRefresh();
						uni.showToast({
							title: res.message,
							icon: "none"
						})
					}
				})
			},

			getBingeWatchList() {
				getBingeWatchList(this.params).then((res) => {
					if (res.code === 200) {
						this.cateList.push(...res.data.data || '')
						this.params.page++
						this.params.total_page = res.data.total_page
					} else {
						uni.showToast({
							title: res.message,
							icon: "none"
						})
					}
				})
			},
			scroll: function(e) {
				this.old.scrollTop = e.detail.scrollTop
			},
			// 历史记录观看
			goHistory(el) {
				if (this.LinkType == false) {
					uni.navigateTo({
						url: "/wxcomponents/testPage/index?video_id=" + el.video_id +
							'&video_detail_id=' + el.video_detail_id
					});
				} else {
					uni.navigateTo({
						url: "/wxcomponents/yjy-video-slide/yjy-video-slide?video_id=" + el.video_id +
							'&video_detail_id=' + el.video_detail_id
					});
				}
			},
			// 追剧观看
			goToDetails(el) {
				if (this.LinkType == false) {
					// uni.navigateTo({
					// 	url: "/wxcomponents/testPage/index?video_id=" + (el.video_id || el.id) +
					// 		'&video_detail_id=' + (el.video_detail_id || el.video_type_id)
					// });
				} else {
					// uni.navigateTo({
					// 	url: "/wxcomponents/yjy-video-slide/yjy-video-slide?video_id=" + el.video_id +
					// 		'&video_detail_id=' + el.video_detail_id
					// });
					uni.navigateTo({
						url: "/wxcomponents/yjy-video-slide/yjy-video-slide?video_id=" + (el.video_id || el.id) +
							'&video_detail_id=' + (el.video_detail_id || el.video_type_id)
					});
				}
			},
			// 去追剧
			gorunVideo() {
				uni.switchTab({
					url: "../Small-theater/Small-theater"
				})
			},
			// 编辑操作
			edit(item) {
				this.video_id = item.video_id
				this.flag = true
			},
			// 停止追剧
			stopVideo() {
				//发起请求
				let obj = {
					video_id: this.video_id
				}
				let self = this;
				getcancelPlay(obj).then((res) => {
					if (res.code === 200) {
						uni.showToast({
							title: "停止追剧成功",
							icon: "none"
						})
						self.flag = false
						self.cateList = []
						self.getBingeWatchList()
					} else {
						uni.showToast({
							title: res.message,
							icon: "none"
						})
					}
				}).catch(err => {
					console.log(err)
				})
			},
			// 关闭弹框
			onClose() {
				this.flag = false
				// setTimeout(function() {
				// 	uni.showTabBar()
				// }, 500);
			},
			/**
			 * 加载更多右侧数据
			 */
			loadMoreCateData() {

			},
			goHelp() {
				uni.navigateTo({
					url: "../../wxcomponents/helpPage/helppage"
				})
			},
			goMore() {
				uni.navigateTo({
					url: "../../wxcomponents/recordPage/recordPage"
				})
			}
		}
	}
</script>
<style>
	page {
		background-color: #ececec;
	}
</style>
<style scoped>
	.noneLogin {
		text-align: center;
	}

	.warp {
		margin-top: 15rpx;
		padding: 10rpx 20rpx 60rpx;
	}

	.warp-sign {
		background-color: #ececec;
		padding: 30rpx;
	}

	.signMask {
		position: fixed;
		top: 0;
		bottom: 0;
		left: 0;
		right: 0;
		background-color: rgba(0, 0, 0, 0.6);
		z-index: 100;
	}

	.signPopup {
		position: fixed;
		top: 180rpx;
		left: 50rpx;
		right: 50rpx;
		background-color: #FFFFFF;
		border-radius: 30rpx;
		padding: 30rpx 70rpx;
		z-index: 1000;
	}

	.signPopup-title {
		text-align: center;
		font-size: 50rpx;
		font-weight: 800;
		letter-spacing: 4rpx;
	}

	.signPopup-tips {
		margin: 40rpx 0;
		color: #8B8989;
		font-size: 26rpx;
		text-align: center;
	}

	.signPopup-Kb {
		display: flex;
		align-items: center;
		justify-content: center;
		background-color: #EBEBEB;
		border-radius: 30rpx;
		padding: 60rpx 0;
	}

	.signPopup-Kb>image {
		width: 80rpx;
		height: 80rpx !important;
	}

	.signPopup-Kb>view {
		font-size: 60rpx;
		color: red;
		font-weight: 800;
		letter-spacing: 2rpx;
		margin-left: 10rpx;
	}

	.signPopup-buttom {
		margin: 50rpx 40rpx;
		text-align: center;
		color: #FFFFFF;
		font-size: 28rpx;
		font-weight: 800;
		background: linear-gradient(to bottom, #FF6347, #d81e06);
		padding: 25rpx 0;
		border-radius: 20rpx;
		letter-spacing: 4rpx;
	}

	.signPopup-close {
		position: absolute;
		bottom: -120rpx;
		left: 0;
		right: 0;
		text-align: center;
	}

	.signPopup-close>image {
		width: 40rpx;
		height: 40rpx !important;
	}

	.sign-view {
		background-color: #FFFFFF;
		border-radius: 30rpx;
		padding: 15rpx 20rpx;
	}

	.sign-view>text {
		font-size: 24rpx;
		color: #8B8989;
		font-weight: 500;
	}

	.sign-view-head {
		font-weight: 600;
		letter-spacing: 2rpx;
	}

	.sign-view-head>text {
		color: #EED580;
		margin: 0 4rpx;
	}

	.sign-info-list {
		padding: 10rpx;
		display: flex;
		justify-content: center;
	}

	.sign-info {
		margin: 0 15rpx;
		background-color: #EDECEE;
		padding: 8rpx 15rpx;
		border-radius: 10rpx;
		text-align: center;
	}

	.stop-sign {
		background-color: #F8D257;
		color: #FFFFFF;
	}

	.sign-info>image {
		width: 35rpx;
		height: 35rpx !important;
	}

	.sign-info>view {
		font-size: 20rpx;
		font-weight: 600;
	}

	.historyWarp {
		display: flex;
		justify-content: space-between;
	}

	.scroll-view_H {
		width: 100%;
		display: flex;
		/* justify-content: space-between; */
		height: 400rpx;
		padding: 10rpx 0rpx;
		overflow-y: auto;
		box-sizing: border-box;
	}

	.imageBox {
		width: 180rpx;
		height: 260rpx;
		margin-right: 26rpx;
	}

	.imageBox:last-child {
		margin-right: 0;
	}

	.imageBox>image {
		width: 180rpx !important;
	}

	.moreBox {
		width: 20%;
		height: 400rpx;
		padding: 10rpx 0rpx;
	}

	.imgBox {
		width: 100%;
		height: 260rpx;
		text-align: center;
		background-color: rgba(0, 0, 0, 0.7);
		display: flex;
		flex-direction: column;
		justify-content: space-evenly;
		align-items: center;
		color: #FFFFFF;
		font-size: 28rpx
	}

	.imgBox image {
		width: 60rpx;
		height: 60rpx !important;
	}

	.check {
		height: 400rpx;
		line-height: 400rpx;
		text-align: center;
		color: #595959;
	}

	image {
		width: 100%;
		height: 260rpx !important;
		border-radius: 8rpx;
	}

	.image {
		width: 180rpx;
		height: 260rpx;
	}

	.text {
		width: 100%;
		color: #000000;
		font-weight: 600;
		font-size: 26rpx;
		text-overflow: ellipsis;
		overflow: hidden;
		white-space: nowrap;
	}

	.count {
		font-size: 20rpx;
		/* text-align: center; */
		color: #555555;
	}

	.title {
		margin: 20rpx 0rpx;
		font-weight: bold;
	}

	.helpIcon {
		display: inline-block;
		width: 35rpx;
		height: 35rpx;
		border-radius: 50%;
		border: 1px solid #5d5d5d;
		color: #5D5D5D;
		text-align: center;
		line-height: 35rpx;
		margin-left: 12rpx;
	}

	/* 详情样式 */
	.cate-right {
		/* height: 800rpx; */
	}

	.cate-rdata {
		display: flex;
		padding: 20rpx 0rpx 0;
	}

	.cate-rinfo {
		flex: 1;
		margin-left: 20rpx;
		padding-bottom: 20rpx;
		border-bottom: 1px solid #eee;
		min-width: 1px;

	}

	.cate-rbtn {
		display: block;
		background-color: #5B78FF;
		z-index: 100;
		color: #fff;
		font-size: 26rpx;
		padding: 6rpx 20rpx;
		border-radius: 40rpx;
	}

	.cate-rfooter {
		display: flex;
		justify-content: space-between;
		align-items: center;
	}

	.cate-rnum {
		flex: 1;
		font-size: 24rpx;
	}

	.cate-rdesc {
		display: block;
		font-size: 26rpx;
		font-weight: bold;
		line-height: 36rpx;
		height: 36rpx;
		text-overflow: ellipsis;
		overflow: hidden;
		white-space: nowrap;
		margin: 30rpx 0rpx;
		color: #faa700;
	}

	.cate-rtitle {
		font-size: 34rpx;
		display: block;
		text-overflow: ellipsis;
		overflow: hidden;
		white-space: nowrap;
		color: #000000;
		font-weight: bold;
	}

	.item-text-tip {
		font-size: 24rpx;
		color: #D00000;
	}

	/* 加载提示 */
	.loading-tips {
		font-size: 24rpx;
		color: $color9;
		padding: 20rpx 0;
		text-align: center;
		margin-top: 110rpx;
	}

	.tip-text {
		font-size: 30rpx;
		color: #C0C0C0;
		margin-bottom: 20rpx;
	}

	.btn {
		width: 200rpx;
		height: 200rpx;
		background-color: #4CD964;
		border-radius: 8rpx;
	}

	.like {
		padding-bottom: 64rpx;
		box-sizing: border-box;
	}

	.noticeBox {
		position: fixed;
		bottom: 0;
		left: 0;
		width: 100%;
		z-index: 1000;
	}


	/* 关注 */
	.popup {
		position: fixed;
		top: 30%;
		left: 0;
		right: 0;
		background-color: #fff;
		width: 60%;
		margin: auto;
		border-radius: 15rpx;
		padding: 40rpx;
		z-index: 1000;
	}

	/* .popupBorder {
		border-bottom: 4px solid #EAEAEA;
	} */
	.popup-close {
		margin-bottom: 15rpx;
		text-align: right;
	}

	.popup-close>image {
		width: 40rpx;
		height: 40rpx !important;
	}

	.popup-home {
		font-size: 34rpx;
		font-weight: 800;
		text-align: center;
		margin: 0 15rpx;
	}

	.popup-home>image {
		margin-bottom: 15rpx;
		width: 120rpx;
		height: 120rpx !important;
	}

	.popup-tips {
		margin: 50rpx 15rpx;
		font-size: 30rpx;
		text-align: center;
		font-weight: 600;
	}

	.popup-button {
		letter-spacing: 6rpx;
		color: #ffffff;
		background: linear-gradient(to bottom, #FF6347, #d81e06);
		padding: 20rpx 0;
		border-radius: 15rpx;
		font-weight: 600;
		text-align: center;
		margin: 0 15rpx 20rpx 15rpx;
	}



	/* 追剧 */
	.popup-base {
		position: fixed;
		top: 40%;
		left: 0;
		right: 0;
		background-color: #fff;
		width: 70%;
		margin: auto;
		border-radius: 15rpx;
		padding-top: 40rpx;
		padding: 20rpx;
	}

	.popup-base-title {
		text-align: center;
		font-size: 30rpx;
		font-weight: 800;
		margin: 10rpx 0 20rpx 0;
		padding: 0 40rpx;
	}

	.popup-base-content {
		text-align: center;
		color: #999aaa;
		font-size: 28rpx;
		margin: 40rpx 0;
		padding: 0 40rpx;
	}

	.popup-base-button {
		display: flex;
		justify-content: space-around;
		align-items: center;
		border-radius: 0 0 15rpx 15rpx;
		margin-bottom: 20rpx;
	}

	.popup-base-button>view {
		text-align: center;
		padding: 10rpx 70rpx;
		display: flex;
		border: 1rpx solid #999aaa;
		border-radius: 40rpx;
		color: #999aaa;
		/* font-weight: 600; */
	}

	.popup-base-button>view+view {
		color: #FFFFFF;
		background-color: #d81e06;
		border: 1rpx solid #d81e06;
	}


	/* 充值 */
	.recharge-view-money {
		display: flex;
		flex-wrap: wrap;
		justify-content: space-between;
	}

	.money-view-select {
		border: 2rpx solid #d81e06 !important;
		background-color: rgba(255, 248, 220, 0.5) !important;
	}

	.money-view {
		width: 46%;
		height: 180rpx;
		border-radius: 30rpx;
		background-color: #F5F5F5;
		margin-bottom: 30rpx;
		position: relative;
		border: 2rpx solid #F5F5F5;
		box-shadow: 2rpx 2rpx 8rpx 0 rgba(0, 0, 0, 0.1);
	}

	.money-view-money {
		margin-top: 90rpx;
		transform: translateY(-100%);
		// margin-left: 20rpx;
		font-size: 38rpx;
		text-align: center;
		font-weight: 800;
		color: #000000;
	}

	.money-view-annualPass {
		transform: translateY(-120%);
		// margin-left: 20rpx;
		text-align: center;


	}

	.money-view-annualPass>text {
		font-size: 24rpx;
		font-weight: 600;
		color: #d81e06;
	}

	.money-view-givemoney {
		transform: translateY(-120%);

		text-align: center;
	}

	.money-view-givemoney>text {
		font-size: 24rpx;
		font-weight: 600;
		color: #8B8989;
	}

	.money-view-givemoney>text+text {
		margin-left: 15rpx;
		color: #8B8989;
	}

	.money-view-giveIdentifying {
		position: absolute;
		bottom: 0;
		left: 0;
		right: 0;
		text-align: center;
		padding: 8rpx 10rpx;
		border-radius: 0 0 30rpx 30rpx;
		color: #d81e06;
		font-weight: 600;
		font-size: 24rpx;
	}

	.giveIdentifying-annualPass {
		background-color: #d81e06;
		color: #ffffff;
	}

	.money-view-label {
		position: absolute;
		top: 0;
		right: 0;
		padding: 8rpx 15rpx;
		border-radius: 0 25rpx 0 30rpx;
		background-color: #d81e06;
		color: #ffffff;
		font-size: 20rpx;
	}

	.pay-title {
		font-size: 38rpx;
		font-weight: 800;
		text-align: center;
	}

	.pay-tips {
		font-size: 26rpx;
		color: #8B8989;
		margin: 15rpx 0;
		padding: 0 20rpx;
		text-align: center;
	}

	.pay-episode {
		display: flex;
		justify-content: center;
		align-items: center;
		text-align: center;
		font-weight: 600;
		margin: 30rpx 0;
		letter-spacing: 2rpx;
	}

	.pay-episode>view>text {
		color: #d81e06;
		font-size: 40rpx;
	}

	.pay-episode>view>text+text {
		font-size: 26rpx;
		color: #000000;
	}

	.account-info {
		display: flex;
		justify-content: space-between;
		color: #8B8989;
		font-size: 26rpx;
		margin-bottom: 20rpx;
	}

	.account-info>view>text {
		color: #d81e06;
	}

	.money-handstyle {
		position: absolute;
		right: -40rpx;
		bottom: -30rpx;
	}

	.money-handstyle>image {
		width: 60rpx;
		height: 65rpx !important;
	}

	.recharge-statement {
		font-size: 24rpx;
		color: #8B8989;
		margin-bottom: 20rpx;
	}

	.recharge-statement>view {
		margin-bottom: 2rpx;
		/* letter-spacing: 1rpx; */
	}




	/* 选集 */

	.tabs-title {
		display: flex;
		margin: 10rpx;
		font-weight: 500;
		font-size: 26rpx;
		text-align: center;
		justify-content: center;
		font-weight: 600;
	}

	.tabs-title>view {
		margin: 0 40rpx;
		padding-bottom: 10rpx;
		border-bottom: 1rpx solid #ffffff;
	}

	.tabs-title-select {
		color: #d81e06;
		font-size: 28rpx;
		border-bottom: 6rpx solid #d81e06 !important;
	}

	.current-title {
		margin: 30rpx 0 15rpx 0;
		display: flex;
		justify-content: space-between;
		align-items: center;
		font-size: 22rpx;
	}

	.current-title>view>view {
		font-size: 32rpx;
		margin-bottom: 10rpx;
		font-weight: 800;
	}

	.episodeTitle-list {
		display: flex;
		margin: 50rpx 0 30rpx 0;
		border-bottom: 6rpx solid #fff;
		overflow: auto;
	}

	.episodeTitle-list::-webkit-scrollbar {
		display: none;
		width: 0;
		height: 0;
		color: transparent;
	}

	.episodeTitle-list>view>view {
		width: 100rpx;
		text-align: center;
		font-size: 30rpx;
		font-weight: 600;
		margin: 0 20rpx;
		padding-bottom: 5rpx;
		color: #8B8989;

	}


	.episode-scroll-list {
		width: 100%;
		height: 450rpx;
		margin: auto;
		font-size: 26rpx
	}

	.episode-list {
		display: flex;
		flex-wrap: wrap;
	}

	.episode-view:nth-child(3n+2) {
		margin-left: 5%;
		margin-right: 5%;
	}

	.episode-view {
		width: 30%;
		flex-wrap: 800;
		background-color: #F7F7F7;
		text-align: center;
		margin: 10rpx 0;
		border-radius: 10rpx;
		padding: 20rpx 0;
		font-weight: 500;
		position: relative;
	}

	.selectEpisode-view {
		background-color: #d81e06;
		color: #FFF;
	}

	.episode-view-lock {
		position: absolute;
		top: 0;
		bottom: 0;
		left: 0;
		right: 0;
		width: 40rpx;
		height: 40rpx !important;
		margin: auto;
	}

	.lock {
		background-color: #BEBEBE;
	}
</style>